<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<button id="showUserList">展示用户列表</button>
<table border="1" id="dataTable" style="display:none;">
	<thead>
		<tr>
			<th>ID</th>
			<th>登录名</th>
			<th>真实名称</th>
			<th>性别</th>
			<th>生日</th>
			<th>描述</th>
		</tr>
	</thead>
	<tbody>
		
	</tbody>
</table>
</body>
<script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
<script type="text/javascript">
var genderArray = ['男', '女'];
$(function() {
	$("#showUserList").one('click', function() {
		$.ajax({
			type:'get',
			url:'/rest/user/list',
			dataType:'json',
			success:function(result) {
				if (result) {
					var bodyHtml = "";
					for (var i=0; i<result.length; i++) {
						var user = result[i];
						var {id, loginName, realName, gender, birth, desc} = user;
						//bodyHtml += "<tr><td>"+id+"</td><td>"+loginName+"</td><td>"+realName+"</td><td>"+genderArray[gender]+"</td><td>"+formatDate(birth)+"</td><td>"+desc+"</td></tr>";
						bodyHtml += `<tr><td>${id}</td><td>${loginName}</td><td>${realName}</td><td>${gender}</td><td>${birth}</td><td>${desc}</td></tr>`;
					}
					$("#dataTable").show().find("tbody").html(bodyHtml);
				}
			},
			error:function() {
				
			}
		});
	});
});

function formatDate(ms) {
    var date = new Date(ms);
    var year = date.getFullYear();
    var month = date.getMonth();
    var day = date.getDate();

    var hour = date.getHours();
    var minites = date.getMinutes();
    var seconds = date.getSeconds();

    month = month * 1 + 1;
    if (month < 10) {
        month = '0' + month;
	}
	if (day < 10) {
        day = '0' + day;
	}
	if (hour < 10) {
        hour = '0' + hour;
	}
	if (minites < 10) {
        minites = '0' + minites;
	}
	if (seconds < 10) {
        seconds = '0' + seconds;
	}
	return year+'-'+month+'-'+day + ' ' + hour + ':'+minites + ':'+seconds;
}
</script>
</html>